<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <ul id="ul">
      <li>demo</li>
    </ul>
    <script>
      const ul = document.getElementById("ul");

      const df = new DocumentFragment();
      while (true) {
        // ① 提供用户输入框
        const text = prompt("请输入文本");
        if (text === null) break; //当用户'取消'时就跳出循环
        // ② 根据输入内容创建 li
        const li = document.createElement("li");
        li.innerHTML = text;
        // ③ li插入到ul
        df.append(li);
      }
      ul.append(df);
    </script>
  </body>
</html>
